import PropTypes from 'prop-types'; //vite-plugin-eslint 里面
// const Welcome = function (props) {
//   return (
//     <div>
//       {/* 整体接受props */}
//       hello welcome {props.msg}, {props.content}
//     </div>
//   );
// };

// const Welcome = function ({ msg, content, isShow, onClick, getData }) {
//   getData('我是子组件数据');
//   return (
//     <div onClick={onClick}>
//       {/* 解构接受props */}
//       hello welcome {msg}, {content}, {isShow + ''}
//     </div>
//   );
// };

const Welcome = function ({ count, msg = 'haha', num, id, type, icon }) {
  return (
    <div>
      {/* 解构接受props */}
      hello welcome , {count}, {msg}, {num}, {id}, {type}, {icon}
    </div>
  );
};
Welcome.propTypes = {
  count: PropTypes.oneOfType([PropTypes.string, PropTypes.number]),
  msg: PropTypes.string,
  num: PropTypes.number, //加上这句就好了
  id: PropTypes.number,
  type: PropTypes.oneOf(['success', 'primary']), //传递的值必须最小一个完全匹配oneOf数组里面的值
  icon: PropTypes.element, //针对jsx
};
// Welcome.defaultProps = {
//   num: 100,
//   id: 999,
// };

// Welcome.propTypes = {
//   isShow: PropTypes.boolean,
//   msg: PropTypes.string,
//   content: PropTypes.number, //加上这句就好了
//   onClick: PropTypes.object,
//   getData: PropTypes.object, //加上这句就好了
// };

const App = () => {
  const info = {
    count: '123',
    msg: 'hi react',
    num: 456,
    id: 789,
    type: 'success',
    icon: <div>icon</div>,
  };
  return (
    <>
      <Welcome {...info}></Welcome>
      <Welcome />
    </>
  );
};
export default App;
